import L from 'leaflet'
// 创建自定义图层类
const MakerIconLayer = L.FeatureGroup.extend({
	options: {
		minValueShowZoom: 7, // 值文字最小显示级别
		minNameShowZoom: 8, // 名称文字最小显示级别
		showClassName: ''
	},
	// 构造函数
	initialize: function (options) {
		// console.info(`options:`, options)
		// this.options = options
		L.setOptions(this, options)
		L.FeatureGroup.prototype.initialize.call(this)
		// 自定义初始化逻辑
	},
	showText: function (e, zoom) {
		console.info(`this.showClassName:`, this.showClassName)
		let _zoom = e ? e.target._zoom : zoom
		let domList = document.querySelectorAll(this.options.showClassName)
		domList = Array.from(domList)
		if (_zoom > this.options.minNameShowZoom) {
			domList.forEach((el) => (el.style.display = 'flex'))
		} else {
			domList.forEach((el) => (el.style.display = 'none'))
		}
	},
	initStart: function (e) {
		console.info(`e:`)
		this.showText(false, this._map._zoom)
	},

	onAdd: function (map) {
		console.info(`add:`)
		this._mapAdd = map
		L.FeatureGroup.prototype.onAdd.call(this, map)
		this._mapAdd.on('zoomend', this.showText, this)
	},
	onRemove: function (map) {
		console.info(`123:`)
		this.clearLayers()
		this._mapAdd.off('zoomend', this.showText, this)
	}

	// // 添加要素到图层
	// addFeature: function (feature) {
	// 	this.addLayer(feature)
	// },

	// // 删除要素从图层
	// removeFeature: function (feature) {
	// 	this.removeLayer(feature)
	// }

	// 可以添加其他自定义方法和属性
})

L.makerIconLayer = function (options) {
	return new MakerIconLayer(options)
}
